a tool for shared writing and social publishing
1"use client";
2import { useUIState } from "src/useUIState";
3import { Footer } from "components/ActionBar/Footer";
4import { Media } from "components/Media";
5import { ThemePopover } from "components/ThemeManager/ThemeSetter";
6import { Toolbar } from "components/Toolbar";
7import { FootnoteToolbar } from "components/Toolbar/FootnoteToolbarWrapper";
8import { ShareOptions } from "app/[leaflet_id]/actions/ShareOptions";
9import { HomeButton } from "app/[leaflet_id]/actions/HomeButton";
10import { PublishButton } from "./actions/PublishButton";
11import { useEntitySetContext } from "components/EntitySetProvider";
12import { Watermark } from "components/Watermark";
13import { BackToPubButton } from "./actions/BackToPubButton";
14import { useLeafletPublicationData } from "components/PageSWRDataProvider";
15import { useIdentityData } from "components/IdentityProvider";
16import { useEntity } from "src/replicache";
17import { block } from "sharp";
18import { PostSettings } from "components/PostSettings";
19
20export function hasBlockToolbar(blockType: string | null | undefined) {
21 return (
22 blockType === "text" ||
23 blockType === "heading" ||
24 blockType === "blockquote" ||
25 blockType === "button" ||
26 blockType === "datetime" ||
27 blockType === "image"
28 );
29}
30export function LeafletFooter(props: { entityID: string }) {
31 let focusedBlock = useUIState((s) => s.focusedEntity);
32
33 let entity_set = useEntitySetContext();
34 let { identity } = useIdentityData();
35 let { data: pub } = useLeafletPublicationData();
36 let blockType = useEntity(focusedBlock?.entityID || null, "block/type")?.data
37 .value;
38
39 return (
40 <Media
41 mobile
42 className="mobileLeafletFooter w-full z-10 touch-none -mt-[54px] "
43 >
44 {focusedBlock &&
45 focusedBlock.entityType == "block" &&
46 hasBlockToolbar(blockType) &&
47 entity_set.permissions.write ? (
48 <div
49 className="w-full z-10 p-2 flex bg-bg-page pwa-padding-bottom"
50 onMouseDown={(e) => {
51 if (e.currentTarget === e.target) e.preventDefault();
52 }}
53 >
54 <Toolbar
55 pageID={focusedBlock.parent}
56 blockID={focusedBlock.entityID}
57 blockType={blockType}
58 />
59 </div>
60 ) : focusedBlock &&
61 focusedBlock.entityType === "footnote" &&
62 entity_set.permissions.write ? (
63 <div
64 className="w-full z-10 p-2 flex bg-bg-page pwa-padding-bottom"
65 onMouseDown={(e) => {
66 if (e.currentTarget === e.target) e.preventDefault();
67 }}
68 >
69 <FootnoteToolbar pageID={focusedBlock.parent} />
70 </div>
71 ) : entity_set.permissions.write ? (
72 <Footer>
73 {pub?.publications &&
74 identity?.atp_did &&
75 pub.publications.identity_did === identity.atp_did ? (
76 <BackToPubButton publication={pub.publications} />
77 ) : (
78 <HomeButton />
79 )}
80 <div className="mobileLeafletActions flex gap-2 shrink-0">
81 <PublishButton entityID={props.entityID} />
82 <ShareOptions />
83 <PostSettings />
84 <ThemePopover entityID={props.entityID} />
85 </div>
86 </Footer>
87 ) : (
88 <div className="pb-2 px-2 z-10 flex justify-end">
89 <Watermark mobile />
90 </div>
91 )}
92 </Media>
93 );
94}